<%@ page contentType="text/html;charset=UTF-8" %>

<!DOCTYPE html>
<html>
<head>
	<title>附件批量录入案例-附件列表</title>
	<%@ include file="/common/import.jsp" %>
    <%@ include file="/common/meta.jsp" %>
    <%@ include file="/js/attachment/common/jquery-swfupload.jsp" %>
    <link rel="stylesheet" type="text/css" href="${ctx}/js/pic/css/piccss.css"/>
	<script>
	//------------------------------------------------------
	  $(function() {
			var path = "${ctx}/js/pic/vinSwfUpload-1.2/";
			var upload_do='${ctx}/attachment/files/uploadAttachment.action?createUserId=${as.createUserId}&createUserRealname=${as.createUserRealname}&createSpaceEname=${as.createSpaceEname}';
			/**/$("#vinEdit1").vinSWFUpload( {
				uploadURL:upload_do,
				width : 1025,
				heigth : 250,
				sizeUnit:"K",
				autoRemove:false,
				filePostName:"file",
				fileLimit:'${attrReg.picTotalNum}',
				maxSize:'${attrReg.maxLength}',
				fileType:"${attrReg.alloweTypes}",
				postParams:{"objId":"${objId}","objType":"${objType}"},
				flashURL : path+"core/SWFUpload.swf",
				addImgURl:path+"images/add.gif",
				uploadImgURl:path+"/images/upload.png",
				stopImgURl:path+"images/stop.png",
				deleteImgURl:path+"images/trash.gif",
				tipImgURl:path+"images/tip.gif"
			});
	$("#showList2").hide();
	$("#showThumb2").hide();
	//加载数据
	loadData();
});

//------------------------------------------------------
/**
 * 删除行
 */
function delRow(){
    var del_pic_do = '${ctx}/attachment/files/deleteAtta.action';
	var id = picRecord.sid;
	$.messager.confirm('提示','确认删除吗？',function(btn){
		if(btn){
			$.ajax({
				url:del_pic_do,
				data:{"id":id,"objType":"${objType}","objId":"${objId}"},
				success:function(data){
					var j = $.parseJSON(data);
					if(j.flag == "T"){
						$.messager.alert('提示',j.msg,'info',function(){
							//加载数据
							loadData();
						});
					}else{
						$.messager.alert('提示',j.msg,'error');
					}
				},
				error:function(){
					$.messager.alert('提示',"删除异常请联系管理员！",'error');
				}
			});
		}
	});
}

//查看
function viewRow(){
	var obj = picRecord ;
	var downUrl = obj.downloadUrl.replace(/\\/gi,"/")+obj.sid+'.'+obj.attachmentType;
	window.open(downUrl,'','menubar=no,toolbar=no,location=no,directories=no,scrollbars=yes,resizable=yes,status=no,width=700px,height=500px');
}

/**
 * 编辑
 */
function editrow(){
    var url = '${ctx}/attachment/files/edit.action?id='+picRecord.sid+"&objType=${objType}&objId=${objId}";
	$('#saveFrame').attr("title",picRecord.attachmentName);
	$('#saveFrame').attr("src",url);
	$('#saveDiv').window('open');
} 

/**
 * 编辑提交
 * @param {Object} index
 */
function doUpdate(){
	$('#editForm').form('submit',{
	    url:upd_pic_store_do,
	    onSubmit:function(){
	    	return $('#editForm').form("validate");
	    },
	    success:function(data){
	    	var oTxt = jQuery.parseJSON(data);
			var mess = oTxt.msg;	
			var flag = oTxt.flag;
	        if(flag == 'T'){
	        	$.messager.alert("提示",mess,"info",function(){
	        		$("#saveDiv").window("close");
	        		loadData();
	        	});
	        }else{
	        	$.messager.alert("提示",data.msg,"error");
	        }
	    }
	});
} 

/**
*切换显示样式
*/
function swithShow(s){
//iconCls="icon-ok" 
	var $f = $("#files_view");
	if(s=='list'){
	$("#showThumb2").show();
	$("#showList2").show();
	$("#showThumb").hide();
	$("#showList").hide();
		$f.removeClass("files_thumbnails").addClass("files_details");
		 //#showList
	}else{
	$("#showThumb2").hide();
	$("#showList2").hide();
	$("#showThumb").show();
	$("#showList").show();
		$f.removeClass("files_details").addClass("files_thumbnails");
		//'#showThumb'
	}
}
//加载数据
function loadData(){
	$.ajax({
		type : "post",//请求方式
		url : "${ctx}/attachment/files/list!data.action",//发送请求地址
		data : {"objId":"${objId}","objType":"${objType}"},
		//请求成功后的回调函数有两个参数
		success : function(data) {
			var d = $.parseJSON(data);
			if(d.flag == 'T'){
				initThumb(d.msg,true);
				initList(d.msg,true);
			}else{
				$.messager.alert("提示",d.msg,"error");
			}
			
		},
		error:function(){
			$.messager.alert("提示","图片列表加载失败！","error");
		}
	});
}



/**
*初始化缩略图
*/
function initThumb(data,clear){
	/*
	<a href="javascript:void(0)" tabindex="-1" class="file_entry">
				<div class="image">
					<div style="background-image: url(&quot;http://localhost:8080/editor/ckfinder/core/connector/java/connector.java?command=Thumbnail&amp;type=Images&amp;currentFolder=%2F&amp;langCode=zh-cn&amp;hash=e83ec720424c2a2c2457a587c5293af&amp;FileName=bg_org_2.gif&quot;);">
					</div>
				</div>
				<h5 id="r0_label">
					bg_org_2.gif
				</h5>
				<span role="list presentation" class="details" id="r0_details">
					<span	class="extra">2011年12月27日 0:15 PM</span>
					<span>1 KB</span>
				</span>
			</a>
	*/
	var $tdiv = $("#thumbDivId");
	if(clear){
		$tdiv.empty();
	}
	for(var i=0;i<data.length;i++){
		var retStr = new Array();
		var t = $(createStr(data[i]));
		$tdiv.append(t);
	}
	
	function createStr(obj){
		var retStr = new Array();
		var downUrl = obj.downloadUrl.replace(/\\/gi,"/")+obj.sid+'.m.'+obj.attachmentType;
		retStr.push('<a href="javascript:void(0)" tabindex="-1" class="file_entry" title="'+obj.attachmentDesc+'">');
		retStr.push('<div class="image">');
		retStr.push('<div style="background-image: url(&quot;'+downUrl+'&quot;);">');
		retStr.push('</div>');
		retStr.push('</div>');
		retStr.push('<h5>');
		retStr.push(obj.attachmentName+'.'+obj.attachmentType);
		retStr.push('</h5>');
		retStr.push('<span class="details">');
		retStr.push('<span	class="extra">'+obj.createTime+'</span>');
		//retStr.push('<span>1 KB</span>');
		retStr.push('</span>');
		retStr.push('</a>');
		var t = $(retStr.join(""));
		bindEvent(t,data[i]);
		$tdiv.append(t);
	}
}
//列表
function initList(data,clear){
	/*
			<tr id="r0">
					<td class="image">
						<img alt="img alt" src="http://localhost:8080/editor/ckfinder/skins/kama/images/icons/16/gif.gif">
					</td>
					<td class="name">
						<a tabindex="-1">bg_org_2.gif</a>
					</td>
					<td>
						1 KB
					</td>
					<td class="last">
						2011年12月27日 0:15 PM
					</td>
				</tr>
	*/
	
	var $ttable = $("#listTableId tbody");
	if(clear){
		$ttable.empty();
	}
	for(var i=0;i<data.length;i++){
		var retStr = new Array();
		retStr.push('<tr title="'+data[i].attachmentDesc+'">');
		retStr.push('<td class="image">');
		retStr.push('&nbsp;&nbsp;');
		//retStr.push('<img alt="img alt" src="http://localhost:8080/editor/ckfinder/skins/kama/images/icons/16/gif.gif">');
		retStr.push('</td>');
		retStr.push('<td class="name">');
		retStr.push('<a tabindex="-1">'+data[i].attachmentName+'.'+data[i].attachmentType+'</a>');
		retStr.push('</td>');
		//retStr.push('<td>1 KB</td>');
		retStr.push('<td class="last">');
		retStr.push(data[i].createTime);
		retStr.push('</td>');
		retStr.push('</tr>');
		var t = $(retStr.join(""));
		bindEvent(t,data[i]);
		$ttable.append(t);
	}
}


//swfupload调用添加addImg
function addImg(obj){
	initList([obj],false);
	initThumb([obj],false);
}

function bindEvent(pic,obj){
	pic.bind("contextmenu",{"rec":obj},function(e){
		picRecord = e.data.rec;
		$('#mm').menu('show', {
			left: e.pageX,
			top: e.pageY
		});
		return false;
	});
}

//------------------------------------------------------
//关闭
	function closeAdd(){
	  $('#saveDiv').window('close');
	}
	//------------------------------------------------------
	
	
	function clickAttaSort(type){
	   if(type=="0"){
	     window.location.href="${ctx}/attachment/files/list.action?objId=${objId}&objType=${objType}";
	   }
	}
	
	</script>
	<style>
	
</style>
</head>
<body style="width:97%;padding-left:10px;">
<div style="padding:5px 0;">
	<span>				  
	 <input type="radio" name="attaSort" value="0"   onclick="clickAttaSort('0')" />&nbsp;附件
	 <input type="radio" name="attaSort" value="1" checked=checked onclick="clickAttaSort('1')" />&nbsp;图片
	</span>	&nbsp;&nbsp;
		<!--<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-add'" title="上传附件" onclick="javascript:addAttaFiles();">上传附件</a>-->
		<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" onclick="javascript:loadData();" >刷新列表</a>
	</div>
<div id="show">
	<div id="picListId" class="easyui-panel" title="图片列表" style="position:relative;"  >
	<div style="background:#EFEFEF;padding:5px;width:99%;">
			<a href="javascript:void(0)"  class="easyui-splitbutton" menu="#mm2" iconCls="icon-preview">设置</a>
			<font color="red">选中图片,右键点击进行其他操作(删除,修改,查看)</font>
	</div>
	<div class="view widget files_thumbnails files_message" id="files_view" style="height: 30%;">
			<div id="thumbDivId" class="files_thumbnails"></div>
			<table id="listTableId" class="files_details">
				<thead>
					<tr>
						<td>
							&nbsp;
						</td>
						<td class="name">
							文件名
						</td>
						<!--  
						<td>
							大小
						</td>
						-->
						<td class="last">
							日期
						</td>
					</tr>
				</thead>
				<tbody>
				</tbody>
			</table>
	</div>
</div>
</div>



<div title="图片上传" class="easyui-panel">
	<div id="vinEdit1" style="width:100%"></div>
</div>
<div id="mm2" class="easyui-menu" style="width:100px;">
		<div iconCls="icon-ok" id="showThumb"onclick="swithShow('thumb')">缩略图</div>
		<div id="showThumb2" onclick="swithShow('thumb')">缩略图</div>
		<div id="showList" onclick="swithShow('list')">列表</div>
		<div id="showList2" iconCls="icon-ok" onclick="swithShow('list')">列表</div>
</div>
<div id="mm" class="easyui-menu" style="width:100px;">
		<div iconCls="icon-search" onclick="viewRow()">查看</div>
		<div iconCls="icon-cancel" onclick="delRow()">删除</div>
		<div iconCls="icon-edit" onclick="editrow()">修改</div>
</div>

 <!-- 修改窗口 -->
	<div id="saveDiv" class="easyui-window" title="附件修改" style="padding:5px;width: 700px;height:380px;" 	
    	iconCls="icon-edit" closed="true" maximizable="false" minimizable="false" collapsible="false">
   		<iframe frameborder="0"  id="saveFrame" height="100%" width="100%" scrolling="No" frameborder="0" ></iframe>
    </div>
</body>
</html>